﻿(function ($) {
    // plugin define
    $.searchsuggest = function (options) {
        debug(this);
        // build main options before element iteration
        var opts = $.extend({}, $.searchsuggest.defaults, options);
        init(opts);
    };
    // defaults
    $.searchsuggest.defaults = {
        inputid: '',
        formid: '',
        cls: 'searchsuggest',
        minChars: 1,
        maxChars: 20,
        showMaxChars: 20,
        width: 300,
        top: 43,
        right: 0,
        items: []//{textPre:'',textPost:'' ,url:''}
    };

    // private：debugging
    function debug($obj) {
        return false;
    };

    function init(opts) {
        if (opts.inputid == '') {
            alert('must config input id');
            return;
        }
        var defaultAction = "";
        if ($("#" + opts.formid).length != 0) {
            defaultAction = $("#" + opts.formid).attr("action");
        }
        //
        var id = opts.inputid + "_searchsuggest";
        $('#' + opts.inputid).parent().parent().append("<div id='" + id + "' class='" + opts.cls + "'><ul></ul></div>");
        $('#' + id).hide();
        $('#' + id).width(opts.width);
        $('#' + id).css("top", opts.top);
        $('#' + id).css("right", opts.right);

        //hidden suggest
        $(document).mouseup(function () {
            $('#' + id).hide();
            $("#" + opts.formid).attr("action", defaultAction);
        });
        $('#' + opts.inputid).attr("maxlength", opts.maxChars);
        //input keyword
        $('#' + opts.inputid).keyup(function (event) {
            var str = $.trim($(this).val());
            if (str.length >= opts.minChars) {

                $('#' + id).show();

                //create suggest html
                var html = "";
                for (var i = 0; i < opts.items.length; i++) {
                    var item = opts.items[i];
                    var keyword = $.trim($("#" + opts.inputid).val());
                    var showWord = keyword;
                    if (showWord.length > opts.showMaxChars) {
                        showWord = showWord.substring(0, opts.showMaxChars);
                        showWord += "...";
                    }

                    html += "<li url='" + item.url + "?keyword=" + keyword + "'>" + item.textPre + " <em>" + showWord + "</em> " + item.textPost + "</li>";
                }
                $('#' + id + ' ul').html(html);

                //create li click
                $('#' + id + ' ul li').each(function () {
                    var $this = $(this);
                    $this.hover(
                        function () {
                            $this.addClass('hover');
                        },
                        function () {
                            $this.removeClass('hover');
                        }
                    );
                    $this.bind('mousedown', function (event) {
                        window.location.href = $this.attr('url');
                        return;
                    });
                })

            } else {
                $('#' + id).hide();
                $("#" + opts.formid).attr("action", defaultAction);
            }
        });
        //key select
        var index = opts.items.length;
        $('#' + opts.inputid).keyup(function (event) {
            if ($.trim($(this).val()).length != 0) {
                switch (event.keyCode) {
                    case 38: //up
                        index--;
                        if (index < 0) {
                            index = opts.items.length - 1;
                        }
                        break;
                    case 40: //down
                        index++;
                        if (index > opts.items.length - 1) {
                            index = 0;
                        }
                        break;
                }
                var li = $('#' + id + ' ul').find("li:eq(" + index + ")");
                if ($("#" + opts.formid).length != 0) {
                    $("#" + opts.formid).attr("action", li.attr("url"));
                }
                li.trigger("mouseover");
            }
        });
    }
})(jQuery);